<template>
  <div class="bigBox">
    <div class="header">
      <div class="about">ABOUT US</div>
      <img src="@/assets/big.jpeg" alt="" class='img'/>
    </div>
    <!-- <el-divider>关于我们</el-divider> -->
    
    <div class="container">
      <div>
      <div class="titles">
        <h1>集团简介</h1>
        <h3>GROUP INTRODUCTION</h3>
        <h3>匠心筑就智慧人居精品---------------------能力有限公司</h3>
      </div>

      <div class="introduces">
        <p>
          能力集团，2006年从广州出发，始于地产而不止于地产。16年来，能力有限公司一直致力于将人类科技的一切探索创新，以人居业态为依托运用于生活中的方方面面，将科技与人文连接，重新构建人类对于自身与居住空间关系的认知。目前，能力集团已经发展成为一家为用户提供贯穿全生命周期智慧人居解决方案的综合性企业。
        </p>

        <p>
          能力集团现已覆盖全国六大最具成长力城市群，在31城全面绽放。每落子一地，均从区域先天资源的统筹观出发，开发每个城市的独特魅力，探索每个城市的人文价值，创造与之匹配的智能生活解决方案，为每座城市打造专属的人居经典。
        </p>

       
      </div>
    </div>
      <div class="imgBox">
            <el-carousel :interval="2000" type="card" height="300px" autoplay>
              <el-carousel-item >
               <img src="../../assets/properties-1.jpg" alt="">
              </el-carousel-item>
               <el-carousel-item >
               <img src="../../assets/properties-5.jpg" alt="">
              </el-carousel-item>
               <el-carousel-item >
               <img src="../../assets/properties-4.jpg" alt="">
              </el-carousel-item>
            </el-carousel>
      </div>
    </div>
  </div>
</template>

<script>

export default {
  data() {
    return {
     
    };
  },
  created() {
    
  },
  methods: {
   
  },
};
</script>

<style scoped lang="scss">
  .bigBox{
    margin: 0 auto;
    background-color: rgba(237, 237, 237, 0.927);
    width: 100%;
  }
.header {
  position: relative;
  height: 525px;
  margin-right: -20px;
  .img{
    width:100%;
  }
}

.about {
  width: 300px;
  height: 50px;
  line-height: 50px;
  color: rgba(255, 253, 253, 0.812);
  font-size: 40px;
  position: absolute;
  left: 40%;
  top: 29%;
  text-align: center;

}
.el-divider__text {
font-size: 30px;
}
.titles {
  padding-bottom: 10px;
  color: #804747;
  margin-bottom: 20px;
}
.introduces {
  line-height: 30px;
  width: 500px;
  padding: 20px;
  font-size: 18px;
  color: #804747;
}

.container {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 0 auto;
}
.imgBox{
  display: flex;
  align-items: center;
  margin-left: 30px;
  height: 600px;
}
.el-carousel{
  width: 800px;
  img{
    width: 400px;
    height: 300px;
  }
}
</style>
